<template>
   <div class="total" >
    <!-- 头部标签 -->
 <header  @click="$router.push('/message')">
<van-nav-bar title="消息详情" left-arrow>
 
</van-nav-bar>
 </header>
 <!-- 系统通知 -->
 <div class="all">
 <div class="comp"  >
    
    <div class="center" >
        <ul>
            <li>{{title}}</li>
            <li>发布人：  <span>{{name}}</span></li>
        </ul>
    </div>
    <div>
    <span>{{time}}</span><van-icon name="arrow" />
    </div>
  
</div>
  <!-- 消息详情 -->
  <div>
      <van-field v-model="dat"  type="textarea" rows="4" autosize  />
  </div>
  </div>
  
   </div>
</template>

<script>
import { MessageDetail} from '../../request/api'
export default {
data(){
    return{
       dat:'',
       time:'',
       name:'',
       title:''
    }
},
created(){
  
    MessageDetail(this.$route.params.id).then(res=>{
        
        this.data=res.data
        console.log(this.data);
        this.title=res.data.title
        this.time=res.data.createTime
        this.name=res.data.sourceName
        this.dat=res.data.msgDate
    })
}
}
</script>

<style lang='less'>
.total{
  background-color: #f5f5f5;
}
header{
    background: #003399;
    .van-nav-bar{background:#003399;
font-size: .2rem;
padding:3% 0 0;
.van-nav-bar__title{
    color: white;
    font-size: .2rem;
}
.van-icon{
    font-size: .2rem;
    color: white;
}
     }
   
}
.all{
      background: white;
    
}
.comp{
    font-size: .15rem!important;
    display: flex;
    line-height: .2rem;
  
    justify-content:space-between;
    margin: 5% 5%;
    align-items: center;
    .center{
         text-align:left;
         flex: 1;
    }
   
    img{
        vertical-align:bottom;
    }
    
    
}
</style>